<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="utf-8" />
<meta name="viewport"
    content="width=device-width,user-scalable=no, initial-scale=1">
<title>CRM</title>
<link rel="stylesheet" type="text/css"
    href="../static/azxcrm/css/wap/mui.min.css"
    th:href="@{/azxcrm/css/wap/mui.min.css}" />
<link rel="stylesheet" type="text/css"
    href="../static/azxcrm/css/wap/mui.picker.min.css"
    th:href="@{/azxcrm/css/wap/mui.picker.min.css}" />
<link rel="stylesheet" type="text/css"
    href="../static/azxcrm/css/wap/aui.css"
    th:href="@{/azxcrm/css/wap/aui.css}" />
<link rel="stylesheet" type="text/css"
    href="../static/azxcrm/css/wap/register.css"
    th:href="@{/azxcrm/css/wap/register.css}" />
<link rel="stylesheet" type="text/css"
    href="//at.alicdn.com/t/font_835360_8flqp9ignrc.css" />
<script src="../static/azxcrm/js/wap/mui.min.js" type="text/javascript"
    th:src="@{/azxcrm/js/wap/mui.min.js}" charset="utf-8"></script>
<script src="../static/azxcrm/js/wap/mui.picker.min.js"
    type="text/javascript" th:src="@{/azxcrm/js/wap/mui.picker.min.js}"
    charset="utf-8"></script>
<script src="../static/azxcrm/js/wap/city.data-3.js"
    type="text/javascript" th:src="@{/azxcrm/js/wap/city.data-3.js}"
    charset="utf-8"></script>
<script src="../static/azxcrm/js/wap/jquery-3.3.1.min.js"
    type="text/javascript" th:src="@{/azxcrm/js/wap/jquery-3.3.1.min.js}"
    charset="utf-8"></script>
<script th:inline="javascript"> var ctx = [[@{/}]]; </script>
</head>
<body>
    <header class="aui-bar aui-bar-nav">
        <a href="javascript:history.back(-1)" class="aui-pull-left aui-btn">
            <span class="iconfont icon-fanhui1">返回</span>
        </a>
        <div class="aui-title">注册</div>
    </header>
    <form class="form-horizontal m" id="form-role-add">
        <section class="aui-grid aui-margin-b-15">
            <div class="aui-content aui-margin-b-15">
                <ul class="aui-list aui-list-in">
                    <li class="aui-list-item">
                        <div class="aui-list-item-inner">
                            <div class="aui-list-item-label">登陆名：</div>
                            <div class="aui-list-item-input">
                                <input type="text" id="registerLoginName"
                                    name="registerLoginName" placeholder="字母加数字,6-12位的组合"
                                    onblur="loginName(this,this.value)" maxlength="12">
                            </div>
                        </div>
                    </li>
                    <li class="aui-list-item">
                        <div class="aui-list-item-inner">
                            <div class="aui-list-item-label">真实姓名：</div>
                            <div class="aui-list-item-input">
                                <input type="text" id="registerRealName" name="registerRealName"
                                    placeholder="真实姓名">
                            </div>
                        </div>
                    </li>
                    <li class="aui-list-item">
                        <div class="aui-list-item-inner">
                            <div class="aui-list-item-label">手机号码：</div>
                            <div class="aui-list-item-input">
                                <input type="text" id="registerPhoneNum" name="registerPhoneNum"
                                    placeholder="手机号码" onblur="Tel(this,this.value)" maxlength="11">
                            </div>
                        </div>
                    </li>
                    <li class="aui-list-item" id="sex">
                        <div class="aui-list-item-inner">
                            <div class="aui-list-item-label">性别：</div>
                            <div class="aui-list-item-input">
                                <input class="sex_fale" type="text" id="registerSex"
                                    name="registerSex" placeholder="请选择性别男/女">
                                <input id="sexNumber" class="sex_value" type="hidden" />
                            </div>
                        </div>
                    </li>
                    <li class="aui-list-item" id="apartment">
                        <div class="aui-list-item-inner">
                            <div class="aui-list-item-label">归属部门：</div>
                            <div class="aui-list-item-input">
                                <input class="apartment_dai" type="text" placeholder="部门">
                                <input class="agent_value" id="deptId" type="hidden">
                            </div>
                        </div>
                    </li>
                    <li class="aui-list-item">
                        <div class="aui-list-item-inner mima">
                            <div class="aui-list-item-label">登陆密码：</div>
                            <div class="aui-list-item-input">
                                <input class="add_lesson_time" id="password" type="password"
                                    placeholder="登陆密码" onblur="pass(this,this.value)">
                            </div>
                            <div class="aui-list-item-label-icon item-label">
                                <i class="iconfont icon-iconset0207" id="Eye" onclick="change()"></i>
                            </div>
                        </div>
                    </li>
                </ul>
            </div>
        </section>
        <footer class="aui-bar aui-bar-tab" id="footer">
            <a class="aui-bar-tab-item btn">
                <div class="aui-bar-tab-label">
                    <input type="button" th:value="提交注册" id='toastBtn'
                        class="btn btn-warning dropdown-toggle"
                        onclick="return check(this.form)">
                </div>
            </a>
        </footer>
    </form>
    <script>
    var sex=document.getElementById("sex");
    var apartment=document.getElementById("apartment")
    // 性别
    var sex_data= new mui.PopPicker();
            sex_data.setData([{
                        value: '0',
                        text: '男',
                    }, {
                        value: '1',
                        text: '女',
                    }
                ])
        sex.addEventListener('tap', function() {
            sex_data.show(function(items) {
                document.getElementsByClassName('sex_fale')[0].value = items[0].text;
                document.getElementsByClassName('sex_value')[0].value = items[0].value; 
                //返回 false 可以阻止选择框的关闭
                //return false;
            });
        }, false);
       
        // 部门
        var arr=[];         
        var apartment_data= new mui.PopPicker();            
        apartment.addEventListener('tap', function() {
            $.ajax({
                cache : true,
                type : "get",
                url : ctx + "/register/getDept",
                data :'',
                async : false,
                success : function(data) {
                	console.log(data)
                    for(var i=0;i<data.length;i++){
                        //console.log(data[i].deptId,data[i].deptName)
                        arr.push({
                            value:data[i].deptId,
                            text:data[i].deptName
                        })                                               
                    }
                }
            });
            apartment_data.setData(arr)
            apartment_data.show(function(items) {
                document.getElementsByClassName('apartment_dai')[0].value = items[0].text;
                document.getElementsByClassName('agent_value')[0].value = items[0].value;
                //返回 false 可以阻止选择框的关闭
                //return false;
            });
        }, false);
    
        function loginName(obj,val){
            
            var reg=/^(?![0-9]+$)(?![a-zA-Z]+$)[0-9A-Za-z]{6,12}$/;         
            if(!reg.test(val)){
                 mui.toast('请输入合法的登陆名')
                 return false
            }else{
                $.ajax({
                    cache : true,
                    type : "post",
                    url : ctx + "/register/checkUserNameUnique",
                    data :{'loginName':val},
                    async : false,
                    error : function(res) {
                        
                    },
                    success : function(data) {
                      if(data!=0){
                          mui.toast('用户名已存在')
                      }
                    }
                })
            } 
                        
        }
        
        function Tel(obj,val){
            var myreg=/^[1][3,4,5,7,8][0-9]{9}$/;
            if(!myreg.test(val)){
            	mui.toast('请输入正确的手机号码')
            	return false
            }else{
              return true;
            }
        }
        function pass(obj,val){
        var reg = /^([a-z0-9\.\@\!\#\$\%\^\&\*\(\)]){6,20}$/i;
        if(!reg.test(val)){
              mui.toast('请输入正确的密码格式')
              return false
          }
        }
        
    var isShow=true;
    function change(){
        var Password = document.getElementById("password");
        var Eye = document.getElementById("Eye");
        if (isShow) {
            Password.type="text";
            isShow=false;
            Eye.style.color="#03a9f4";
        }else{
            Password.type="password";
            isShow=true;
            Eye.style.color="#212121";
        }
    };

    function check(form) {  
        var LoginName = document.getElementById('registerLoginName').value;
        var RealName = document.getElementById('registerRealName').value;
        var PhoneNum = document.getElementById('registerPhoneNum').value;
        var sexNumber = document.getElementById('sexNumber').value;
        var deptId = document.getElementById('deptId').value;
        var password = document.getElementById('password').value;
        var registerSex=document.getElementById('registerSex').value; // 性别
        var departMent= document.getElementsByClassName('apartment_dai')[0].value;
        
        var reg=/^(?![0-9]+$)(?![a-zA-Z]+$)[0-9A-Za-z]{6,12}$/;   
        var myreg=/^[1][3,4,5,7,8][0-9]{9}$/;
        var passwordReg = /^([a-z0-9\.\@\!\#\$\%\^\&\*\(\)]){6,20}$/i;
        if(LoginName==''){
        	mui.toast('请输入登陆名');
        	return false;
        }else if(!reg.test(LoginName)){
        	mui.toast('请输入合法的登陆名');
            return false;
        }else if(RealName==''){
       	   mui.toast('请输入真实姓名');
           return false;
        }else if(PhoneNum==''){
            mui.toast('请输入手机号码');
            return false;
        }else if(!myreg.test(PhoneNum)){
        	mui.toast('请输入正确的手机号码')
            return false;
        }else if(registerSex==''){
            mui.toast('请选择性别');
            return false;
        }else if(departMent==''){
            mui.toast('请选择部门');
            return false;
        }else if(password==''){
            mui.toast('请输入密码');
            return false;
        }else if(!passwordReg.test(password)){
        	mui.toast('请输入正确的密码格式')
            return false;
        }else{
        	 $.ajax({
                 cache : true,
                 type : "POST",
                 url : ctx + "register/saveRegisterUser",
                 data :{
                     "registerLoginname": LoginName,
                     "registerRealname": RealName,
                     "registerPhonenum": PhoneNum,
                     "registerSex": sexNumber,
                     "registerDeptid": deptId,
                     "registerPassword": password,
                     },
                 async : false,
                 error : function(request) {
                     console.log(request)
                     mui.toast("系统错误", "error");
                 },
                 success : function(data) {
                           if(data.msg=='该部门无部门经理审核'){
                        	   mui.toast("该部门无部门经理审核,请重新选择部门"); 
                        	   return false;
                           }else if(data.msg=='还未审批通过无法重复提交'){
                        	   mui.toast("还未审批通过无法重复提交");
                           }else if (data.code == 0) {  
                                mui.toast("注册成功");
                                $("#toastBtn").removeAttr("onclick");
                                  setTimeout(function(){
                                     window.location.href= ctx + "loginWap"
                                     },2200) 
                             } else {
                                 mui.toast("注册失败");
                          } 
                   }
             });
        }
       
    }
</script>
</body>
</html>

